<!-- 级联选择器 -->
<template>
  <!--
     options渲染数据
     separator选项分割符, 默认为 /
     props修改默认的属性label, value, children
    -->
  <el-cascader separator="-" :options="list" :props="{label:'name', value:'id'}" :value="value" @change="change" />
</template>

<script>
import { getDepartmentAPI } from '@/api/department'
import { arrayToTree } from '@/utils'

export default {
  props: {
    value: {
      type: Number,
      default: null
    }
  },

  data() {
    return {
      list: []
    }
  },
  created() {
    this.getData()
  },
  methods: {
    // 获取部门数据
    async  getData() {
      const res = await getDepartmentAPI()
      this.list = arrayToTree(res)
    },
    change(value) {
      this.$emit('input', value[value.length - 1])
    }
  }

}
</script>

<style lang="scss" scoped>

</style>
